<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:p="http://primefaces.org/ui"
	template="/resources/templates/default.xhtml">

	<ui:param name="pageTitle" value="INICIO" />

	<ui:define name="titulo">
		PRODUCTOS
	</ui:define>

	<ui:define name="contenido">
		<h:form id="form">
		
			<p:growl id="msg" showDetail="true" sticky="true" />
			

			<h:panelGrid columns="3">
				<h:outputLabel value="Cedula" />
				<h:inputText value="#{productosBean.reserva.cedula}" id="cedula"  />
				<h:message for="cedula" styleClass="help-inline" />
				
				<h:outputLabel value="Nombres y Apellidos" />
				<h:inputText value="#{productosBean.reserva.nombre}" id="apellido"  />
				<h:message for="apellido" styleClass="help-inline" />
								
				<h:outputLabel value="E-Mail" />
				<h:inputText value="#{productosBean.reserva.mail}" id="mail"  />
				<h:message for="mail" styleClass="help-inline" />
				
			</h:panelGrid>
			<p:commandButton  onclick="dlgLogin.show()" value="GUARDAR" />
			
			<p:dialog  widgetVar="dlgLogin" modal="false" >
					Confirma la reservacion
					<p:commandButton  actionListener="#{productosBean.guardar()}" value="GUARDAR" update="@form"/>
			</p:dialog>






			
			<h1>Disponibles</h1>
			
			<p:dataTable id="disponibles" value="#{productosBean.productos}" var="obj">
				
				<p:column headerText="Proveedor">
						<h:inputText value="#{obj.provedorObj.nombre}" disabled="true" />
				</p:column>
				<p:column headerText="ID">
						<h:inputText value="#{obj.codigo}" disabled="true" />
				</p:column>
				<p:column headerText="Descripcion">
					<h:inputText value="#{obj.nombre}" disabled="true" />
				</p:column>
				<p:column headerText="Costo">
					<h:inputText value="#{obj.costo}" disabled="true" />
				</p:column>
				<p:column headerText="Opciones">
					<p:commandLink value="Add" actionListener="#{productosBean.addProducto(obj)}" update="@form"/>

				</p:column>				
				
							
			</p:dataTable>
			
			
			<h1>Seleccionados</h1>
			<p:dataTable id="seleccionados" value="#{productosBean.productosSeleccionados}" var="obj">
				
				<p:column headerText="Proveedor">
						<h:inputText value="#{obj.provedorObj.nombre}" disabled="true" />
				</p:column>
				<p:column headerText="ID">
						<h:inputText value="#{obj.codigo}" disabled="true" />
				</p:column>
				<p:column headerText="Descripcion">
					<h:inputText value="#{obj.nombre}" disabled="true" />
				</p:column>
				<p:column headerText="Costo">
					<h:inputText value="#{obj.costo}" disabled="true" />
				</p:column>
				<p:column headerText="Opciones">
					<p:commandLink value="Quitar" actionListener="#{productosBean.removeProducto(obj)}" update="@form">
					</p:commandLink>
				</p:column>				
				
							
			</p:dataTable>
			

			
			
			
						

		</h:form>
	</ui:define>

</ui:composition>
